/*
 * 1. data생성하기.
 * 2. 모델 생성하기.
 * 3. 스토어 생성후 data를  store에 연결.
 * 4. NestedList 생성하기.
 * 5. Panel에 리스트 추가하기.
 */
Ext.setup({
	tabletStartupScreen : "./tabletStartupScreen.png",
	phoneStartupScreen : "./phoneStartupScreen.png",
	tabletIcon : "./tabletIcon.png",
	phoneIcon : "./phoneIcon.png",
	glossOnIcon : true,
	statusBarStyle : "black",
	fullscreen : true,
	preloadImages : [],
	scope : this,
	onReady : function() {
		/*
		 * 1. data생성하기.
		 */
		var data = {
			text : 'Groceries',
			items : [ {
				text : 'Drinks',
				items : [ {
					text : 'Water',
					items : [ {
						text : 'Sparkling',
						leaf : true
					}, {
						text : 'Still',
						leaf : true
					} ]
				}, {
					text : 'Coffee',
					leaf : true
				}, {
					text : 'Espresso',
					leaf : true
				}, {
					text : 'Redbull',
					leaf : true
				}, {
					text : 'Coke',
					leaf : true
				}, {
					text : 'Diet Coke',
					leaf : true
				} ]
			}, {
				text : 'Fruit',
				items : [ {
					text : 'Bananas',
					leaf : true
				}, {
					text : 'Lemon',
					leaf : true
				} ]
			}, {
				text : 'Snacks',
				items : [ {
					text : 'Nuts',
					leaf : true
				}, {
					text : 'Pretzels',
					leaf : true
				}, {
					text : 'Wasabi Peas',
					leaf : true
				} ]
			}, {
				text : 'Empty Category',
				items : []
			} ]
		};
		/*
		 * 2. 모델 생성하기.
		 */
		Ext.regModel('ListItem', {
			fields : [ {
				name : 'text',
				type : 'string'
			} ]
		});
		/*
		 * 3. 스토어 생성후 data를 store에 연결.
		 */
		var store = new Ext.data.TreeStore({
			model : 'ListItem',
			root : data,
			proxy : {
				type : 'ajax',
				reader : {
					type : 'tree',
					root : 'items'
				}
			}
		});
		/*
		 * 4.NestedList 생성하기.
		 */
		var nestedList = new Ext.NestedList({
			fullscreen : true,
			title : "Groceries",
			displayField : 'text',
			store : store
		});
		/*
		 * 5. Panel에 리스트 추가하기.
		 */
		new Ext.Panel({
			fullscreen : true,
			scroll : "vertical",
			layout : "fit",
			dockedItems : [ {
				dock : 'top',
				xtype : 'toolbar',
				title : 'NestedList Sample 1'
			}, ],
			items : nestedList
		})
	}
});